XAML WebView control sample

This sample demonstrates how to use the WebView control.

Note  This sample was created using one of the universal app templates available in Visual Studio. It shows how its solution is structured so it can run on both Windows 8.1 and Windows Phone 8.1. For more info about how to build apps that target Windows and Windows Phone with Visual Studio, see Build apps that target Windows and Windows Phone 8.1 by using Visual Studio.

Specifically, this sample covers:

• Navigating a WebView to a specific URL by calling the Navigate method.
• Loading your own HTML into a WebView by calling NavigateToString.
• Loading HTML from the app package or from the local or temporary folders using the ms-appx-web and ms-appdata schemes.
• Loading HTML and support files (such as CSS, script, and images) by calling NavigateToLocalStreamUri.
• Invoking JavaScript functions in WebView-hosted content from your app code by calling the InvokeScriptAsync method.
• Receiving notifications and data in your app code sent from WebView-hosted script by handling the ScriptNotify event.
• Supporting the Share contract by using the CaptureSelectedContentToDataPackageAsync method to retrieve the currently-selected content in the WebView control. (Windows only)
• Using the CapturePreviewToStreamAsync method to create a thumbnail image of the WebView content.

To obtain an evaluation copy of Windows 8.1, go to Windows 8.1.

To obtain an evaluation copy of Microsoft Visual Studio 2013, go to Visual Studio 2013.

Note  For Windows 8 app samples, download the Windows 8 app samples pack. The samples in the Windows 8 app samples pack will build and run only on Microsoft Visual Studio 2012.

Related topics

Roadmaps

Roadmap for C# and Visual Basic

Samples

Windows 8.1 app samples

Reference

CaptureSelectedContentToDataPackageAsync

InvokeScriptAsync

Navigate

NavigateToString

NavigateToLocalStreamUri

ScriptNotify

WebView

CapturePreviewToStreamAsync

Concepts

Create a blog reader

Operating system requirements

Build the sample

1. Start Microsoft Visual Studio 2013 Update 2 and select File > Open > Project/Solution.
2. Go to the directory to which you unzipped the sample. Then go to the subdirectory named for the sample and double-click the Visual Studio 2013 Update 2 Solution (.sln) file.
3. Follow the steps for the version of the sample you want:

   • To build the Windows version of the sample:

     1. Select Controls_WebView.Windows in Solution Explorer.
     2. Press Ctrl+Shift+B, or use Build > Build Solution, or use Build > Build Controls_WebView.Windows.

   • To build the Windows Phone version of the sample:

     1. Select Controls_WebView.WindowsPhone in Solution Explorer.
     2. Press Ctrl+Shift+B or use Build > Build Solution or use Build > Build Controls_WebView.WindowsPhone.

Run the sample

The next steps depend on whether you just want to deploy the sample or you want to both deploy and run it.

Deploying the sample

• To deploy the built Windows version of the sample:

  1. Select Controls_WebView.Windows in Solution Explorer.
  2. Use Build > Deploy Solution or Build > Deploy Controls_WebView.Windows.

• To deploy the built Windows Phone version of the sample:

  1. Select Controls_WebView.WindowsPhone in Solution Explorer.
  2. Use Build > Deploy Solution or Build > Deploy Controls_WebView.WindowsPhone.

Deploying and running the sample

• To deploy and run the Windows version of the sample:

  1. Right-click Controls_WebView.Windows in Solution Explorer and select Set as StartUp Project.
  2. To debug the sample and then run it, press F5 or use Debug > Start Debugging. To run the sample without debugging, press Ctrl+F5 or use Debug > Start Without Debugging.

• To deploy and run the Windows Phone version of the sample:

  1. Right-click Controls_WebView.WindowsPhone in Solution Explorer and select Set as StartUp Project.
  2. To debug the sample and then run it, press F5 or use Debug > Start Debugging. To run the sample without debugging, press Ctrl+F5 or use Debug > Start Without Debugging.